let test = [
    { Serial: '1', name: '2021年语文第一次月考', peoples: '100', pass: '60', passRate: '60%', excellence: '80%' },
    { Serial: '2', name: '2021年语文第一次月考', peoples: '100', pass: '60', passRate: '60%', excellence: '80%' },
    { Serial: '3', name: '2021年语文第一次月考', peoples: '100', pass: '60', passRate: '60%', excellence: '80%' },
    { Serial: '4', name: '2021年语文第一次月考', peoples: '100', pass: '60', passRate: '60%', excellence: '80%' },
    { Serial: '5', name: '2021年语文第一次月考', peoples: '100', pass: '60', passRate: '60%', excellence: '80%' },
];
let oTable = document.querySelector('tbody');
let oDiv = document.querySelector('.lwy-main-sect-accuracy');
let oDiv1 = document.querySelectorAll('.lwy-main-sect-accuracy .lwy-main-sect-accuracy-div1');
var myChart = echarts.init(document.getElementById('main'));
var myChartA = echarts.init(document.getElementById('min'));
var myChartI = echarts.init(document.getElementById('man'));
var myChartN = echarts.init(document.getElementById('mai'));
// 圆形图表
var option = {
    title: {
    },
    series: [
        {
            type: 'pie',
            data: [
                {
                    value: 335,
                },
                {
                    value: 734,
                },
            ],
            radius: ['40%', '70%']
        }
    ]
};
myChart.setOption(option);
myChartA.setOption(option);
myChartI.setOption(option);
myChartN.setOption(option);
// 表格渲染
let str = '';
for (let i = 0; i < test.length; i++) {
    str += `<tr>
    <td>${test[i].Serial}</td>
    <td>${test[i].name}</td>
    <td>${test[i].peoples}</td>
    <td>${test[i].pass}</td>
    <td>${test[i].passRate}</td>
    <td>${test[i].excellence}</td>
</tr>`
};
oTable.innerHTML = str;
// 图表
for (let i = 0; i < oDiv1.length; i++) {
    oDiv1[i].addEventListener('click', function () {
        for (let i = 0; i < oDiv1.length; i++) {
            oDiv1[i].classList.remove('lwy-main-sect-accuracy-div2');
            oDiv1[i].classList.add('lwy-main-sect-accuracy-chart2');
        }
        this.classList.add('lwy-main-sect-accuracy-div2');
        this.classList.remove('lwy-main-sect-accuracy-chart2');
    });
};